<template>
	<view class="u-p-y-20 bg-white">
		<mescroll-body ref="mescrollRef" :bottombar="false" @init="mescrollInit" @down="downCallback" @up="upCallback">
			<view class="">
				<view class="u-p-x-30 u-p-b-20" v-for="(item,index) in discussList" :key="index">
					<view class="flex align-center u-p-t-20">
						<u-avatar :src="$_BASE_IMG_API + item.avatar" size="80"></u-avatar>
					  <view class="flex flex-column u-m-l-20">
					    <text class="u-font-26 u-m-b-10" >{{item.nickname || '匿名用户xxx'}}</text>
					    <text class="u-font-24 text-greey">{{item.createtime}}</text>
					  </view>
					</view>
					<view class="flex u-m-y-20 u-font-24">{{item.content}}</view>
					<view class="flex flex-wrap" v-if="item.images">
						<block v-for="(item1,indey) in item.images.split(',')" :key="indey">
							<image class="u-m-r-16 u-m-b-10 border" :src="$_BASE_IMG_API + item1" style="width: 110rpx;height: 110rpx; border-radius: 55rpx;" mode=""></image>
						</block>
					</view>
					<view class="u-p-20 rounded-10" style="background-color: #ecebec;" v-if="item.reply">
						<view class="flex align-center">
							<u-icon name="server-man" size="35" color="#999"></u-icon>
							<text class="u-p-l-10 u-font-25 text-greey">掌柜回复：</text>
						</view>
						<text class="flex u-p-l-30 u-p-y-20 u-font-24">{{item.reply}}</text>
					</view>
				</view>
			</view>
		</mescroll-body>
	</view>
</template>

<script>
	import MescrollMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mescroll-mixins.js";
	import { GoodsCenterApi } from '@/api/serves.js'
	export default {
		mixins: [MescrollMixin], // 使用mixin
		data() {
			return {
				itemId: '',
				discussList: []
			}
		},
		onLoad(options) {
			console.log('options', options);
			this.itemId = options.itemId
		},
		methods: {
			// 下拉刷新回掉
			downCallback() {
				this.mescroll.resetUpScroll() 
			},
			// 上拉加载
			upCallback(page) {
				this.$ShowLoading()
				GoodsCenterApi.goods_comments({ goods_id: this.itemId, pageNum: page.num}).then(res => {
				  console.log('获取商品评价', res);
					this.$HideLoading()
					if(res.code == 1){
						if(page.num == 1) this.discussList = []; //如果是第一页需手动制空列表
						this.discussList = this.discussList.concat(res.data); //追加新数据
						this.mescroll.endBySize(res.data.length, res.count)
					}else {
						this.$Toast(res.msg)
						this.mescroll.endErr()
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>

</style>
